<template>
  <!--赵雄伟 商品出库-->
    <div>
      <el-row>
        <el-col span="2">
          <el-dropdown @command="handleCommand">
  <span class="el-dropdown-link">
    审核状态<i class="el-icon-arrow-down el-icon--right"></i>
  </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="a">待审核</el-dropdown-item>
              <el-dropdown-item command="b">审核失败</el-dropdown-item>
              <el-dropdown-item command="c">审核成功</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </el-col>
        <el-col span="2">
          <el-dropdown @command="handleCommand">
  <span class="el-dropdown-link">
    入库类型<i class="el-icon-arrow-down el-icon--right"></i>
  </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="a">采购退货出库</el-dropdown-item>
              <el-dropdown-item command="b">调拨出库</el-dropdown-item>
              <el-dropdown-item command="c">销售出库</el-dropdown-item>
              <el-dropdown-item command="c">盘亏出库</el-dropdown-item>
              <el-dropdown-item >其他出库</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </el-col>
        <el-col span="6">
          <el-input
          placeholder="请输入出库单号"
          v-model="input"
          clearable>
        </el-input>
        </el-col>
        <el-col span="1">
          <el-button icon="el-icon-search" circle></el-button>
        </el-col>
        <el-col span="3" offset="10">
          <el-button>导出</el-button>
          <router-link to="/stock/outstock/SaveOutStock"> <el-button type="primary">新增</el-button></router-link>
        </el-col>
      </el-row>
      <br>
      <el-row >
        <el-col span="24">
          <el-table
            :data="tableData"
            border
            style="width: 100%"
            header-align="center">
            <el-table-column
              fixed
              prop="esNum"
              label="出库单号"
              width="140"
              >
            </el-table-column>
            <el-table-column
              prop="esStore"
              label="出库门店"
              width="140">
            </el-table-column>
            <el-table-column
              prop="esType"
              label="出库类型"
              width="140">
            </el-table-column>
            <el-table-column
              prop="esAmount"
              label="出库数量"
              width="140">
            </el-table-column>
            <el-table-column
              prop="esHandle"
              label="经办人员"
              width="140">
            </el-table-column>
            <el-table-column
              prop="esMakeListPerson"
              label="制单人员"
              width="140">
            </el-table-column>
            <el-table-column
              prop="esMakeListDate"
              label="制单日期"
              width="140">
            </el-table-column>
            <el-table-column
              prop="auditStatus"
              label="审核状态"
              width="140">
            </el-table-column>
            <el-table-column
              prop="operation"
              label="操作"
              width="118">
              <el-row>
                <el-col span="2" >
                  <router-link to="/stock/outstock/DetailOutStock"><el-button size="mini" round>详情</el-button></router-link><br>
                  <router-link to="/stock/outstock/UpdateOutStock"> <el-button size="mini" round>修改</el-button></router-link><br>
                  <router-link to="/stock/outstock/HandleOutStock"><el-button size="mini" round>审核</el-button></router-link><br>
                  <el-button size="mini" round>删除</el-button>
                </el-col>
              </el-row>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
      <el-row>
        <el-col span="10" :offset="4">
          <div class="block">
            <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage4"
              :page-sizes="[100, 200, 300, 400]"
              :page-size="100"
              layout="total, sizes, prev, pager, next, jumper"
              :total="400">
            </el-pagination>
          </div>
        </el-col>
      </el-row>
    </div>
</template>

<script>
    import ElSelectDropdown from "_element-ui@2.15.0@element-ui/packages/select/src/select-dropdown";
    export default {
      name: "OutStock",
      components: {ElSelectDropdown},
      methods: {
        handleClick(row) {
          console.log(row);
        }
      },
      data() {
        return {
          input: '',
          tableData: [{
            esNum: 'RK123456789',
            esStore: '武侯店',
            esType: '采购入库',
            esAmount: '1000',
            esHandle: '小王',
            esMakeListPerson: '小王',
            esMakeListDate: '2021-1-1',
            auditStatus: '待审核'
          }, {
            esNum: 'RK123456789',
            esStore: '武侯店',
            esType: '采购入库',
            esAmount: '1000',
            esHandle: '小王',
            esMakeListPerson: '小王',
            esMakeListDate: '2021-1-1',
            auditStatus: '待审核'
          }, {
            esNum: 'RK123456789',
            esStore: '武侯店',
            esType: '采购入库',
            esAmount: '1000',
            esHandle: '小王',
            esMakeListPerson: '小王',
            esMakeListDate: '2021-1-1',
            auditStatus: '待审核'
          }, {
            esNum: 'RK123456789',
            esStore: '武侯店',
            esType: '采购入库',
            esAmount: '1000',
            esHandle: '小王',
            esMakeListPerson: '小王',
            esMakeListDate: '2021-1-1',
            auditStatus: '待审核'
          }],
          currentPage1: 5,
          currentPage2: 5,
          currentPage3: 5,
          currentPage4: 4
        }
      },
      methods: {
        handleCommand(command) {
          this.$message('click on item ' + command);
        },
        handleSizeChange(val) {
          console.log(`每页 ${val} 条`);
        },
        handleCurrentChange(val) {
          console.log(`当前页: ${val}`);
        }
      }
    }
</script>

<style scoped>
  .el-dropdown-link {
    cursor: pointer;
    color: #409EFF;
  }
  .el-icon-arrow-down {
    font-size: 12px;
  }
</style>
